<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"
	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
	layout:decorator="business/layout">
<head>
<script th:src="@{/js/jquery-migrate-1.2.1.min.js}"></script>
<script th:src="@{/js/jquery.jqprint-0.3.js}"></script>
<meta charset="utf-8"/>
</head>
<body class="no-skin">

<div layout:fragment="content">
  <div class="main-inner">
    <div class="container">
      	<div class="span12">
      		<div class="info-box">
      			<table id="showOrder" class="table table-striped table-bordered table-hover">
      				<thead>
      					<tr>
      						<th>订单编号</th>
      						<th>下单日期</th>
      						<th>订单金额</th>
      						<th>是否结账</th>
      						<th>操作订单</th>
      					</tr>
      				</thead>
      				<tbody>
      				</tbody>
      			</table>
    			<div class="panel col-sm-10 panel-default">
        			<div class="panel-body reply-top media">
            			<div id="page"></div>
        			</div>
    			</div>
      		</div>
         </div>
    </div>
    <!-- /container --> 
  </div>
  <!-- /main-inner --> 
  
  <div class="modal hide" id="showOrderModal" tabindex="-1" role="dialog"
			aria-labelledby="showOrderModallabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">&times;</button>
					</div>
					<span class="hidden orderId"></span>
					<div class="modal-body">
						<table>
							<thead>
								<tr>
									<th>菜名</th>
									<th>价格</th>
								</tr>
								<tr>
									<td>---------------------------------------------</td>
									<td>---------------------------------------------</td>
								</tr>
							</thead>
							<tbody class="text-center order">
							
							</tbody>
								<tr>
									<td>---------------------------------------------</td>
									<td>---------------------------------------------</td>
								</tr>
								<tr class="text-center" id="totalPrice">
								
								</tr>
						</table>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
						<button id="payOrder" type="button" class="btn btn-primary">结账</button>
					</div>
				</div>
			</div>
		</div>
  
  <script type="text/javascript">
  /*<![CDATA[*/
  $().ready(function(){
	  pagehtml();
	  //查看订单
	  $('body').delegate('.show-order','click',function(){
		  $("#payOrder").prop("disabled",false);
		  var id = $(this).parent().siblings().eq(0).text();
		  $(".orderId").text(id);
		  var status = $(this).parent().siblings().eq(3).text();
		  if(status == "是"){
			  $("#payOrder").prop("disabled",true);
		  }
		  $.ajax({
			  data : {id : id},
			  type : 'post',
			  url : '/order/getOrderDetail',
			  dataType : 'json',
			  success : function(data){
				  var html = "";
				  var htmlTotalPrice = "";
				  htmlTotalPrice += "<td>总金额：&nbsp;￥"+ data[0].totalPrice +"</td><td></td>";
				  $.each(data,function(index,item){
					  var foodTotal = item.foodCount * item.price;
					  html += "<tr>";
					  html += "<td>"+ item.foodName +"&nbsp;&nbsp;X"+ item.foodCount +"</td>";
					  html += "<td>￥"+ foodTotal +"</td>";
					  html += "</tr>";
				  });
				  $(".order").html(html);
				  $("#totalPrice").html(htmlTotalPrice);
				  $("#showOrderModal").modal("show");
			  }
		  });
	  });
	  
	  //结账
	  $("#payOrder").click(function(){
		  var id = $(".orderId").text();
			$.ajax({
				data : {id : id},
				type : 'post',
				dataType : 'json',
				url : '/order/payComplete',
				success : function(data){
					if(data.success){
						alert("结账完成!");
						var msg = "是否打印订单？\n\n请确认！";
						if (confirm(msg) == true) {
							$("#showOrderModal .modal-body").jqprint();
						}else{
							window.location.reload();
						}
					}else{
						alert("结账失败！");
					}
				}
			});
	  });
	  
	  //删除订单
	  $('body').delegate('.delete-order','click',function(){
		var msg = "您真的确定要删除吗？\n\n请确认！";
		if (confirm(msg) == true) {
			var id = $(this).parent().siblings().eq(0).text();
		  $.ajax({
			  data : {id : id},
			  type : 'post',
			  url : '/order/deleteOrder',
			  dataType : 'json',
			  success : function(data){
				  if(data.success){
					  alert("删除成功！");
					  window.location.reload();
				  }else{
					  alert("删除失败！");
				  }
			  }
		  });
		}
	  });
	  
  });
  function pagehtml(pageNum) {
	    if (pageNum == null){
	        pageNum=1;
	    } else {
	        pageNum=pageNum;
	    }
	    $.ajax({
	        url:"/order/findAllOrders",
	        type:"post",
	        dataType:"json",
	        data: {pageNum : pageNum, pageSize : 5},
	        success:function (data) {
	            var options = {
	                alignment:"center",//居中显示
	　　　　　　　　　　currentPage: data.pageNum,//当前页数
	　　　　　　　　　　totalPages: data.pages,//总页数 注意不是总条数
	　　　　　　　　　　pageUrl: function(type, page, current){
	                    if (page==current) {
	                        return "javascript:void(0)";
	                    } else {
	                        return "javascript:pagehtml("+page+")";
	                    }
	                }
	            };
	            var html = "";
	            var status;
	            $.each(data.list, function (i, obj) {
	                if(obj.orderStatus == 0){
	                	status = "否";
	                }else{
	                	status = "是";
	                }
	                html += '<tr>';
	            	html += '<td>'+ obj.id +'</td>';
	                html += '<td>'+ obj.orderDate +'</td>';
	                html += '<td>'+ obj.totalPrice +'</td>';
	                html += '<td>'+ status +'</td>';
	                html += '<td><button class="button button-primary button-rounded button-small show-order">查看订单</button>&nbsp;&nbsp;&nbsp;';
	                if(obj.orderStatus == 1){
						html += '<button class="button btn-danger button-rounded button-small delete-order">删除</button></td>';
	                }else{
	                	html += '<button disabled="disabled" class="button btn-danger button-rounded button-small delete-order">删除</button></td>';
	                }
	                html += '</tr>';
	            });
	            $("#showOrder tbody").empty();
	            $("#showOrder tbody").append(html);
	            $("#page").bootstrapPaginator(options);
	        },
	        error:function (error) {
	            alert("error");
	        }
	    });
	}
  /*]]>*/
  </script>
  
</div>
</body>
</html>
